<template>
  <div class="dropdown-box pointer">
    <el-dropdown trigger="click"
                 @command="dropdownHandle">
      <span class="el-dropdown-link">
        {{`${info.tenantName}——${info.userName}`}}
        <i class="el-icon-arrow-down el-icon--right"></i>
      </span>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item disabled>公司别称：{{ info.alias || info.tenantAlias }}</el-dropdown-item>
        <el-dropdown-item v-for="item in dropdownData"
                          :key="item.routerPath"
                          :command="item.routerPath"
                          :disabled="
            item.downName === '设置别称' && info.type !== 1 ? true : false
          ">{{ item.downName }}</el-dropdown-item>
        <!-- <el-dropdown-item>设置别称</el-dropdown-item>
          <el-dropdown-item>安全退出</el-dropdown-item> -->
      </el-dropdown-menu>
    </el-dropdown>
  </div>
</template>

<script>
import { mapActions, mapState } from "vuex";
import { tenantInfo, commonInfo } from "@/api/modules/breadHandle";
import { clearMenuMap } from "@menu";
// import { PrevLoading } from '@/libs/loading.js';

export default {
  name: "BreadHandle",
  data () {
    return {
      dropdownData: [
        { downName: "账户中心", routerPath: "tabComponent", disabled: false },
        {
          downName: "设置别称",
          routerPath: "companyNickName",
          disabled: false
        },
        { downName: "安全退出", routerPath: "login", disabled: false }
      ],
      info: {},
      userInfo: sessionStorage.getItem('userInfo')
    };
  },
  computed: {
    ...mapState({
      menu: (state) => state.menu.menu
    }),
    user () {
      return JSON.parse(this.userInfo)
    },
    userType () {
      return this.user?.type
    },
    userId () {
      return this.user?.userId
    },
  },
  created () {
    // userType => 1管理员   => 3普通用户
    // this.userType === 1 ? this.tenantInfo() : this.commonInfo()
    this.tenantInfo();
    this.commonInfo();
  },
  methods: {
    ...mapActions({
      // clearSearchPageSize: "pageSize/clearSearchPageSize"
    }),
    dropdownHandle (command) {
      // 加载 loading
      // PrevLoading.start();
      if (command === 'login') {
        // this.clearFirstNewRecordSearch(this.userId)
        sessionStorage.removeItem("token");
        sessionStorage.removeItem("userInfo");
        clearMenuMap()
        // clearMenuTree()
      }
      this.$router.push({ name: command });
      // PrevLoading.done();
    },
    tenantInfo () {
      tenantInfo(this.user?.tenantId).then((response) => {
        let { data } = response;
        this.info = { ...this.info, ...data };
        this.$store.commit("tenant/TENANTINFO", data);
      });
    },
    commonInfo () {
      commonInfo().then((response) => {
        let { data } = response;
        this.info = { ...this.info, ...data, userName: data.name };
      });
    }
  }
};
</script>

<style scoped>
.el-dropdown-link {
  color: var(--prev-color-primary);
}
.nickname {
  color: var(--prev-color-primary);
}
</style>
